import React, { useEffect, useState } from 'react';
import './index.less';
import { Tabs, NavBar, Empty, Dialog, Toast } from 'antd-mobile';
import { history, request } from 'umi';
import Cticket from './cticket';

export default function Coupons() {
  const [Classify, setClassify] = useState([]);
  const [dataList, setdatalist] = useState([]);
  const [key, setkey] = useState('1');
  const [token, setToken] = useState(sessionStorage.getItem('token') || '');
  async function classfiyShow() {
    let data = await request('/api/classify/getOne');
    console.log(data, '分类数据');
    if (data.code == 200) {
      setClassify(data.data);
    }
  }
  //   async function goodShow() {
  //     let data = await request('/api/coupons/find');
  //     console.log(data, '优惠券');
  //     if (data.code == 200) {
  //       setdatalist(data.data);
  //     }
  //   }
  useEffect(() => {
    classfiyShow();
    goodShow(key);
  }, []);
  function back() {
    history.goBack();
  }
  async function goodShow(keys) {
    console.log(keys, 35);
    if (keys == undefined) {
      keys = 1;
    } else {
      setkey(keys);
    }
    let data = await request('/api/coupons/good/' + keys, { method: 'POST' });
    console.log(data, '分类数据1');
    if (data.code == 200) {
      console.log(data, '分类数据2');

      setdatalist(data.data);
    }
  }
  async function setDone(id) {
    if (token) {
      console.log(id, '父组件接受');
      let data = await request('/api/coupons/done/' + id, { method: 'POST' });
      if (data.code == 200) {
        if (data.done) {
          console.log('跳转');
        } else {
          goodShow(key);
        }
      }
    } else {
      Dialog.confirm({
        content: '请先登录',
        onConfirm: async () => {
          setTimeout(() => {
            history.push('/username');
          }, 3000);
          Toast.show({
            icon: 'loading',
            content: '加载中…',
          });
        },
      });
    }
  }
  return (
    <div className="coupons">
      <NavBar onBack={back}>领券中心</NavBar>
      <Tabs
        defaultActiveKey={1}
        activeKey={key}
        onChange={(key) => goodShow(key)}
      >
        <Tabs.Tab title="推荐" key={1}>
          {dataList.length != 0 ? (
            dataList.map((item1) => {
              return (
                <Cticket
                  {...item1}
                  setDone={(id) => {
                    setDone(id);
                  }}
                  key={item1._id}
                ></Cticket>
              );
            })
          ) : (
            <Empty description="暂无优惠券" />
          )}
        </Tabs.Tab>
        {Classify.map((item, index) => {
          return (
            <Tabs.Tab title={item.name} key={item._id}>
              {dataList.length != 0 ? (
                dataList.map((item1) => {
                  return (
                    <Cticket
                      {...item1}
                      key={item1.good.class}
                      setDone={setDone}
                    ></Cticket>
                  );
                })
              ) : (
                <Empty description="暂无优惠券" />
              )}
            </Tabs.Tab>
          );
        })}
      </Tabs>
    </div>
  );
}
